<!DOCTYPE html>
<html lang="en" class="app">
<head>  
  <meta charset="utf-8" />
  <title>匠心独创</title>
  <meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <link rel="stylesheet" href="../css/bootstrap.css" type="text/css" />
  <link rel="stylesheet" href="../css/animate.css" type="text/css" />
  <link rel="stylesheet" href="../css/font-awesome.min.css" type="text/css" />
  <link rel="stylesheet" href="../css/simple-line-icons.css" type="text/css" />
  <link rel="stylesheet" href="../css/font.css" type="text/css" />
  <link rel="stylesheet" href="../css/app.css" type="text/css" />
  <link rel="stylesheet" href="../css/personal_set_people.css" type="text/css" />
  <!--[if lt IE 9]>
    <script src="js/ie/html5shiv.js"></script>
    <script src="js/ie/respond.min.js"></script>
    <script src="js/ie/excanvas.js"></script>
    <![endif]-->
</head>
<body class="">
  <section class="vbox">
    <header class="bg-white-only header header-md navbar navbar-fixed-top-xs">
      <div class="navbar-header aside bg-info dk">
        <a class="btn btn-link visible-xs" data-toggle="class:nav-off-screen,open" data-target="#nav,html">
          <i class="icon-list"></i>
        </a>
        <a href="index.html" class="navbar-brand text-lt">
          <i class="icon-earphones"></i>
          <img src="images/logo.png" alt="." class="hide">
          <span class="hidden-nav-xs m-l-sm">DIY</span>
        </a>
        <a class="btn btn-link visible-xs" data-toggle="dropdown" data-target=".user">
          <i class="icon-settings"></i>
        </a>
      </div>      <ul class="nav navbar-nav hidden-xs">
        <li>
          <a href="#nav,.navbar-header" data-toggle="class:nav-xs,nav-xs" class="text-muted">
            <i class="fa fa-indent text"></i>
            <i class="fa fa-dedent text-active"></i>
          </a>
        </li>
      </ul>
      <form class="navbar-form navbar-left input-s-lg m-t m-l-n-xs hidden-xs" role="search">
        <div class="form-group">
          <div class="input-group">
            <span class="input-group-btn">
              <button type="submit" class="btn btn-sm bg-white btn-icon rounded"><i class="fa fa-search"></i></button>
            </span>
            <input type="text" class="form-control input-sm no-border rounded" placeholder="搜索项目">
          </div>
        </div>
      </form>
      <div class="navbar-right ">
        <ul class="nav navbar-nav m-n hidden-xs nav-user user">
          <li class="dropdown">
            <a href="project-index.html" class="dropdown-toggle bg clear"  >
              发布项目
              <span class=" fa fa-plus-square">
              </span>
            </a>
          </li>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle bg clear" data-toggle="dropdown">
              <span class="thumb-sm avatar pull-right m-t-n-sm m-b-n-sm m-l-sm">
                <img src="../images/a0.png" alt="...">
              </span>
            郑浩 <b class="caret"></b>
            </a>
            <ul class="dropdown-menu animated fadeInRight">            
              <li>
                <span class="arrow top"></span>
                <a href="personal_set.html">设置</a>
              </li>
              <li>
                <a href="docs.html">帮助</a>
              </li>
              <li class="divider"></li>
              <li>
                <a href="signin.html"  >退出</a>
              </li>
            </ul>
          </li>
        </ul>
      </div>      
    </header>
    <section>
      <section class="hbox stretch">
        <!-- .aside -->
        <aside class="bg-black dk aside hidden-print" id="nav">          
          <section class="vbox">
            <section class="w-f-md scrollable">
              <div class="slim-scroll" data-height="auto" data-disable-fade-out="true" data-distance="0" data-size="10px" data-railOpacity="0.2">
                


                <!-- nav -->                 
                <nav class="nav-primary hidden-xs">
                  <ul class="nav bg clearfix">
                    <li class="hidden-nav-xs padder m-t m-b-sm text-xs text-muted">
                      类别
                    </li>
                    <li>
                      <a href="index.html">
                        <i class="icon-disc icon text-success"></i>
                        <span class="font-bold">教育</span>
                      </a>
                    </li>
                    <li>
                      <a href="index.html">
                        <i class="icon-music-tone-alt icon text-info"></i>
                        <span class="font-bold">科技</span>
                      </a>
                    </li>
                    <li>
                      <a href="index.html">
                        <i class="icon-drawer icon text-primary-lter"></i>
                        <span class="font-bold">艺术</span>
                      </a>
                    </li>
                    <li>
                      <a href="index.html">
                        <i class="icon-list icon  text-info-dker"></i>
                        <span class="font-bold">生活</span>
                      </a>
                    </li>
                    <li>
                      <a href="index.html" >
                        <i class="icon-social-youtube icon  text-primary"></i>
                        <span class="font-bold">娱乐</span>
                      </a>
                    </li>
                    <li>
                      <a href="index.html" >
                        <i class="icon-social-youtube icon  text-primary"></i>
                        <span class="font-bold">废物利用</span>
                      </a>
                    </li>
                    <li class="m-b hidden-nav-xs"></li>
                  </ul>
                  <ul class="nav" data-ride="collapse">
                    <li class="hidden-nav-xs padder m-t m-b-sm text-xs text-muted">
                      参与
                    </li>
                    <li >
                      <a href="project-index.html" class="auto">
                        <span class="pull-right text-muted">
                          <i class="fa fa-angle-left text"></i>
                          <i class="fa fa-angle-down text-active"></i>
                        </span>
                        <i class="icon-screen-desktop icon">
                        </i>
                        <span>发布项目</span>
                      </a>
                    </li>
                    <li >
                      <a href="personal_profile.html" class="auto">
                        <span class="pull-right text-muted">
                          <i class="fa fa-angle-left text"></i>
                          <i class="fa fa-angle-down text-active"></i>
                        </span>
                        <i class="icon-screen-desktop icon">
                        </i>
                        <span>个人中心</span>
                      </a>
                    </li>
                  </ul>

                </nav>
                <!-- / nav -->
              </div>
            </section>
            
            <footer class="footer hidden-xs no-padder text-center-nav-xs">
              <div class="bg hidden-xs ">
                  <div class="dropdown dropup wrapper-sm clearfix">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                      <span class="thumb-sm avatar pull-left m-l-xs">                        
                        <img src="../images/a3.png" class="dker" alt="...">
                        <i class="on b-black"></i>
                      </span>
                      <span class="hidden-nav-xs clear">
                        <span class="block m-l">
                          <strong class="font-bold text-lt">John.Smith</strong> 
                          <b class="caret"></b>
                        </span>
                        <span class="text-muted text-xs block m-l">Art Director</span>
                      </span>
                    </a>
                    <ul class="dropdown-menu animated fadeInRight aside text-left">                      
                      <li>
                        <span class="arrow bottom hidden-nav-xs"></span>
                        <a href="#">Settings</a>
                      </li>
                      <li>
                        <a href="personal_profile.html">Profile</a>
                      </li>
                      <li>
                        <a href="#">
                          <span class="badge bg-danger pull-right">3</span>
                          Notifications
                        </a>
                      </li>
                      <li>
                        <a href="docs.html">Help</a>
                      </li>
                      <li class="divider"></li>
                      <li>
                        <a href="modal.lockme.html" data-toggle="ajaxModal" >Logout</a>
                      </li>
                    </ul>
                  </div>
                </div>            </footer>
          </section>
        </aside>
        <!-- /.aside -->
        <section id="content">
          <section class="vbox">
            <section class="scrollable">
              <section class="hbox stretch">
                <aside class="aside-lg bg-light lter b-r">
                  <section class="vbox">
                    <section class="scrollable">
                      <div class="wrapper">
                        <div class="text-center m-b m-t">
                          <a href="#" class="thumb-lg">
                            <img src="../images/a0.png" class="img-circle">
                          </a>
                          <div>
                            <div class="h3 m-t-xs m-b-xs">郑浩</div>
                            <small class="text-muted"><i class="fa fa-map-marker"></i> 中国，河南</small>
                          </div>                
                        </div>
                        <div class="panel wrapper">
                          <div class="row text-center">
                            <div class="col-xs-6">
                              <a href="#">
                                <span class="m-b-xs h4 block">245</span>
                                <small class="text-muted">关注</small>
                              </a>
                            </div>
                            <div class="col-xs-6">
                              <a href="#">
                                <span class="m-b-xs h4 block">55</span>
                                <small class="text-muted">粉丝</small>
                              </a>
                            </div>
                          </div>
                        </div>
                        <div class="btn-group btn-group-justified m-b">
                          <a class="btn btn-success btn-rounded" data-toggle="button">
                            <span class="text">
                              <i class="fa fa-eye"></i> Follow
                            </span>
                            <span class="text-active">
                              <i class="fa fa-eye"></i> Following
                            </span>
                          </a>
                          <a class="btn btn-dark btn-rounded">
                            <i class="fa fa-comment-o"></i> Chat
                          </a>
                        </div>
                        <div>

                          <p>简介</p>

                          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi id neque quam. Aliquam sollicitudin venenatis ipsum ac feugiat.</p>
                          <div class="line"></div>

                          <p>联系方式</p>
                          <div class="row m-t-sm">
                            <div class="col-xs-6">
                                <small class="text">邮箱</small>
                            </div>
                            <div class="col-xs-6">
                                <small class="text">841318441</small>
                            </div>
                          </div>
                          <div class="row m-t-sm">
                            <div class="col-xs-6">
                              <small class="text">生日</small>
                            </div>
                            <div class="col-xs-6">
                              <small class="text">1995-12-2</small>
                            </div>
                          </div>
                          <div class="row m-t-sm">
                            <div class="col-xs-6">
                              <small class="text">地址</small>
                            </div>
                            <div class="col-xs-6">
                              <small class="text">河南省郑州市中原区</small>
                            </div>
                          </div>
                        </div>
                      </div>
                    </section>
                  </section>
                </aside>
                <aside class="bg-white">
                  <section class="vbox">
                    <header class="header bg-light lt">
                      <ul class="nav nav-tabs nav-white">
                        <li class="active"><a href="#activity" data-toggle="tab">关注项目</a></li>
                        <li class=""><a href="#events" data-toggle="tab">参与项目</a></li>

                      </ul>
                    </header>
                    <section class="scrollable">
                      <div class="tab-content">
                        <div class="tab-pane active" id="activity">
                          <ul class="list-group no-radius m-b-none m-t-n-xxs list-group-lg no-border">
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                            <span class="icon-eye fl-r "></span>
                            <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item">

                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>

                            </li>
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item">

                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>

                            </li>
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item" href="#email-content" data-toggle="class:show">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                            <li class="list-group-item">
                              <a href="#" class="clear">
                                <strong class="inlines">项目名称</strong>

                                <span class="icon-eye fl-r "></span>
                                <span class="icon-heart  fl-r m-r-md"></span>

                                <small class="block m-t-sm">Wellcome and play this web application template ... </small>
                                <small class="block m-t-sm">3 minuts ago</small>

                              </a>
                            </li>
                          </ul>
                        </div>
                        <div class="tab-pane" id="events">
                          <div class="text-center wrapper">
                            <i class="fa fa-spinner fa fa-spin fa fa-large"></i>
                          </div>
                        </div>
                        <div class="tab-pane" id="interaction">
                          <div class="text-center wrapper">
                            <i class="fa fa-spinner fa fa-spin fa fa-large"></i>
                          </div>
                        </div>
                      </div>
                    </section>
                  </section>
                </aside>

              </section>
            </section>
          </section>
          <a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen,open" data-target="#nav,html"></a>
        </section>
      </section>
    </section>    
  </section>
  <script src="js/jquery.min.js"></script>
  <!-- Bootstrap -->
  <script src="js/bootstrap.js"></script>
  <!-- App -->
  <script src="js/app.js"></script>
  <script src="js/slimscroll/jquery.slimscroll.min.js"></script>
  <script src="js/charts/easypiechart/jquery.easy-pie-chart.js"></script>
  <script src="js/app.plugin.js"></script>

</body>
</html>